<template>
  <div class="app-container" style="padding: 0px;position:relative;">
    <div style="color: #72A4FF;font-size: 20px;font-weight: bold;">站点报警TOP5</div>
    <bar-chart :chart-data="chartDataObj" :height="'380px'"/>
  </div>
</template>

<script>
  import { parseTime } from "@/utils/ruoyi";
  import { queryCountTopFive } from "@/api/basic/paramAlarmRec";
  import BarChart from './BarChart';

  const chartDataObj = {
    xAxisData: [],//['ee', 'ff'],
    seriesData:[],//  [79, 52, 200, 334, 390, 330, 220],
  }

  export default {
    components: {BarChart},
    data() {
      return {
        chartDataObj:chartDataObj,
        paramInfoList:[],
        dateRange:'',
        queryCountParams:{},
      };
    },
    mounted() {
      let nowDate = new Date();
      let endTime = parseTime(nowDate,'{y}-{m}-{d} {h}:{i}:{s}');
      let befDate = new Date(nowDate.getTime() - 365 * 24 * 3600 * 1000);
      let startTime = parseTime(befDate,'{y}-{m}-{d} {h}:{i}:{s}');
      this.dateRange = [startTime,endTime];
      this.getCountTopFive();
    },
    created() {

    },
    methods: {
      getCountTopFive() {
        let _this = this;
        _this.chartDataObj.xAxisData = [];
        _this.chartDataObj.seriesData = [];
        queryCountTopFive(this.addDateRange(this.queryCountParams, this.dateRange)).then(response => {
          response.forEach(function (item) {
            _this.chartDataObj.xAxisData.push(item.pointName);
            _this.chartDataObj.seriesData.push(item.countNum);
          });
        })
      },

    },
  };
</script>

